<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp" %>
<!DOCTYPE html>
<html lang="en">
<head>
    <title>报表模块（登录报表）</title>
    <%@ include file="/WEB-INF/views/modules/commons/head.jsp" %>
    <!-- header -->
    <%@ include file="/WEB-INF/views/include/header.jsp" %>
    <style>
        #gridTable tr td{
            text-align:center;
        }
        #gview_gridTable thead tr th .ui-jqgrid-sortable{
            text-align:center;
        }
        .nav {
            margin-left: 0;
        }

        /*.nav > li > a:focus, .nav > li > a:hover {*/
            /*text-decoration: none;*/
            /*background-color: #33CCFF !important;*/
        /*}*/
        #gview_gridTable .ui-jqgrid-bdiv{
            max-height: 450px; !important;
        }
        #main-container {
            padding-top: 45px;
            position: relative;
            height: calc(100%);
            margin-left: 17.5%;
            margin-top: 60px;
        }

        .modal-dialog {
            z-index: 9999999;
        }

        @media (min-width: 768px) {
            .modal-content {
                -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, .5);
                box-shadow: 0 -2px 20px rgba(0, 0, 0, .5) !important;
            }
        }

        .search-row{
            margin-left: 7px !important;
        }
    </style>
</head>
<body class="bgcolor">
<%@ include file="/WEB-INF/views/modules/commons/nav.jsp" %>
<%@ include file="/WEB-INF/views/modules/commons/menu.jsp" %>

<!-- /section:basics/navbar.layout -->
<table></table>
<div class="main-container" id="main-container">
    <%--搜索查询--%>
    <%--<div class="row search-row">--%>
        <%--<div class="col-xs-2">--%>
            <%--<input type="text" class="form-control" placeholder="请输入搜索的关键字">--%>
        <%--</div>--%>
        <%--<div class="col-xs-1">--%>
            <%--<button class="btn btn-large btn-primary">搜索</button>--%>
        <%--</div>--%>
        <%--<div class="col-xs-2">--%>
            <%--<select class="form-control">--%>
                <%--<option value="">请选择角色</option>--%>
                <%--<option value="">副县长</option>--%>
                <%--<option value="">经办人</option>--%>
                <%--<option value="">责任人</option>--%>
                <%--<option value="">领导</option>--%>
            <%--</select>--%>
        <%--</div>--%>
        <%--<div class="col-xs-2">--%>
            <%--<select class="form-control">--%>
                <%--<option value="">请选择用户类别</option>--%>
                <%--<option value="">业主单位</option>--%>
                <%--<option value="">审批单位</option>--%>
                <%--<option value="">督查组</option>--%>
            <%--</select>--%>
        <%--</div>--%>
    <%--</div>--%>
    <!-- /section:basics/sidebar -->
    <div class="main-content">
        <div class="main-content-inner">
            <div class="page-content">
                <!-- /section:settings.box -->
                <div class="row">
                    <div class="col-xs-12">
                        <div class="pull-left">
                            <button class="btn btn-sm btn-info" id="queryOnLineList">查询筛选</button>
                            <button class="btn btn-sm btn-success" id="exportTable">导出登录详情</button>
                            <%--<button id="cancelChecked" class="btn btn-sm btn-default">清除选中行</button>--%>
                        </div>
                        <div class="pull-right">
                            <button class="btn btn-sm btn-danger" id="msgTable">消息报表</button>
                            <button class="btn btn-sm btn-danger" id="showMailTable">通讯录</button>
                            <button class="btn btn-sm btn-danger" id="showNodeTable">节点报表</button>
                            <button class="btn btn-sm btn-danger" id="showProjectTable">项目报表</button>
                            <button class="btn btn-sm btn-danger" id="showLoginTable">登录报表</button>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-xs-12">
                        <table id="gridTable"></table>
                        <div id="gridPager"></div>
                        <div style="display: none;">
                            <div class="row" id="queryDialog"></div>
                        </div>
                    </div><!-- /.col -->
                </div><!-- /.row -->
            </div><!-- /.page-content -->
        </div>
    </div><!-- /.main-content -->

    <a href="#" id="btn-scroll-up" class="btn-scroll-up btn btn-sm btn-inverse">
        <i class="ace-icon fa fa-angle-double-up icon-only bigger-110"></i>
    </a>

</div><!-- /.main-container -->
</div>
<!-- footer -->
<script src="<s:url value="/assets/web/js/jquery.min.js?v=2.1.4"></s:url>"></script>
<link rel="stylesheet" href="<s:url value="/assets/web/css/login/bootstrap.min.css?v=3.3.6"></s:url>">
<script src="<s:url value="/assets/web/js/jqpaginator.min.js"></s:url>"></script>
<script src="<s:url value="/assets/web/js/baseAPI.js"></s:url>"></script>
<script src="<s:url value="/assets/web/common/bootstrapvalidator/dist/js/bootstrapValidator.js"></s:url>"></script>
<%@ include file="/WEB-INF/views/include/footer.jsp" %>
<!-- dialog -->
<%@ include file="/WEB-INF/views/include/dialog.jsp" %>

<script type="text/javascript">
    //基本路径
    var baseUrl = "<s:url value="/reportForm4"></s:url>/"
    //jqgrid的表格高度
    var height = 320;
    //jqgrid表格行头的中文
    var colNames = ['', '查询时间','姓名', '登录次数', '登录排名','进行中节点/督查任务数','部门','角色'];
    var colModel = [
        {name: 'sysid', width: 60, hidden: true, key: true},
        {name: 'queryTime', index: 'queryTime', width: 60, editable: true},
        {name: 'name', index: 'name', width: 60, editable: true},
        {name: 'num', index: 'num', width: 60, editable: true},
        {name: 'rownum', index: 'rownum', width: 60, editable: true},
        {name: 'progressNodes', index: 'progressNodes', width: 60, editable: true},
        {name: 'branch', index: 'branch', width: 60, editable: true},
        {name: 'role', index: 'role', width: 60, editable: true}
    ];
    //jqgrid的具体执行方法
    jqgrid({
        autoScroll: false,
        shrinkToFit: true,
        gridTableId: "#gridTable",
        gridPagerId: "#gridPager",
        onSelectRow: function (rowid, status) {
            rowids = $('#gridTable').jqGrid('getGridParam', 'selarrrow');
        },
        onSelectAll: function (aRowids, status) {
            rowids = $('#gridTable').jqGrid('getGridParam', 'selarrrow');
        },
        gridComplete: function () {
            var rowIds = jQuery("#gridTable").jqGrid('getDataIDs');
            for (var k = 0; k < rowIds.length; k++) {
                var flag = false;
                for (var i = 0; i < rowids.length; i++) {
                    if (rowids[i] == rowIds[k]) {
                        flag = true;
                        continue;
                    }
                }
                if (flag && flag == true) {
                    jQuery("#gridTable").setSelection(rowIds[k], true);
                }
            }
        }
    });
    //清空选中行
    $("#cancelChecked").click(function () {
        $("#gridTable").jqGrid('resetSelection');
        rowids = [];
    });
    var rowids = [];//选中行id

    /**
     * 重写Array
     */
    Array.prototype.remove = function (val) {
        var index = this.indexOf(val);
        if (index > -1) {
            this.splice(index, 1);
        }
    };

    /**
     * 重写Array
     */
    Array.prototype.indexOf = function (val) {
        for (var i = 0; i < this.length; i++) {
            if (this[i] == val) return i;
        }
        return -1;
    };


    /**
     * 导出表头选择
     */
    $("#exportTable").click(function () {
        loadDialog({
            dialogTitle: '导出表',
            dialogUrl: getUrl("formHead"),
            dialogFoot: '<button type="button" class="btn btn-primary" onclick="exports()">确认</button>' +
                '<button type="button" class="btn btn-pink" onclick="reset()">重置</button>' +
                '<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>'
        });
    });

    function exports() {
        var exportExcel = '';
        exportExcel = $('#formDialog #formHeads').serialize();
        var win = confirm("确认导出？");
        if (win == true) {
            var url = "";
            if(!isEmpty(exportData)){
                url = "/export/exportOnLineList?"+exportExcel + "&" +exportData;
            }else{
                url = "/export/exportOnLineList?"+exportExcel;
            }
            console.log(url);
            window.open(url);
        }
    }

    $("#queryOnLineList").click(function () {
        showDialog({
            dialogTitle: '查询设置',
            dialogBody: queryDialog,
            dialogFoot: "<button type='button' class='btn btn-primary' onclick='query()'>查询</button>" +
                "<button type='button' class='btn btn-pink' onclick='reset()'>重置</button>" +
                "<button type='button' class='btn btn-default' data-dismiss='modal'>关闭</button>"
        });
    });
    //加载查询对话框
    $("#queryDialog").load(getUrl("filter"));
    //显示查询对话框
    var queryDialog = $("#queryDialog");


    //重置表单
    function reset() {
        exportData = undefined;
        resetForm("#formDialog form");
    }

    //具体查询方法
    function query() {
        //验证时间
        var startDate =$("#startDate").val();
        var endDate =$("#endDate").val();
        validTime(startDate,endDate);
        if(isvalidTime){
            exportData = $('#formDialog form').serialize();
            console.log(exportData);
            exportData = exportData;
            seachJqgird("#gridTable", "#formDialog form");
            $("#formDialog").modal('hide');
        }
    }
    var exportData;

    $("#msgTable").click(function () {
        window.location.href = '/sysMessageManger';
    });
    $("#showMailTable").click(function () {
        window.location.href = '/reportForm1';
    });
    $("#showNodeTable").click(function () {
        window.location.href = '/reportForm2';
    });
    $("#showProjectTable").click(function () {
        window.location.href = '/reportForm3';
    });
    $("#showLoginTable").click(function () {
        window.location.href = '/reportForm4';
    });

</script>

</body>
</html>